<script id="scriptInit" type="text/javascript">
require(["wijmo.wijgrid"], function () {
$(document).ready(function () {
$("#grid").wijgrid({
//Bind Wijgrid to a data source
data: nwind.customers,
columnsAutogenerationMode: "none",
columns: [
//set dataKey value
{ dataKey: "CompanyName", headerText: "Company name" },
{ dataKey: "ContactName", headerText: "Contact name" }
],
detail: {
data: nwind.orders,
columnsAutogenerationMode: "none",
columns: [
{ dataKey: "OrderDate", headerText: "Order date", dataType: "datetime" },
{ dataKey: "Freight", headerText: "Freight", dataType: "number" }
],
//Link master-detail tables using relation
relation: [
{ masterDataKey: "CustomerID", detailDataKey: "CustomerID" }
],
detail: {
data: nwind.orderDetails,
columnsAutogenerationMode: "none",
columns: [
{ dataKey: "ProductName", headerText: "Product name" },
{ dataKey: "UnitPrice", headerText: "Unit price", dataType: "currency" },
{ dataKey: "Quantity", headerText: "Quantity", dataType: "number" }
],
relation: [
{ masterDataKey: "OrderID", detailDataKey: "OrderID" }
]
}
}
});
});
});
//fetch data from nwind database
var nwind = {
//table customers
customers: [
{ CustomerID: "ALFKI", CompanyName: "Alfreds Futterkiste", ContactName: "Maria Anders" },
{ CustomerID: "ANATR", CompanyName: "Ana Trujillo Emparedados y helados", ContactName: "Ana Trujillo" },
{ CustomerID: "ANTON", CompanyName: "Antonio Moreno Taqueria", ContactName: "Antonio Moreno" }
],
//table orders
orders: [
{ OrderID: 10643, CustomerID: "ALFKI", OrderDate: new Date(2015, 8, 26), Freight: 29.46 },
{ OrderID: 10692, CustomerID: "ALFKI", OrderDate: new Date(2015, 10, 3), Freight: 61.02 },
{ OrderID: 10702, CustomerID: "ALFKI", OrderDate: new Date(2015, 10, 13), Freight: 23.94 },
{ OrderID: 10308, CustomerID: "ANATR", OrderDate: new Date(2014, 9, 19), Freight: 1.61 },
{ OrderID: 10625, CustomerID: "ANATR", OrderDate: new Date(2015, 8, 8), Freight: 43.9 },
{ OrderID: 10365, CustomerID: "ANTON", OrderDate: new Date(2014, 11, 28), Freight: 22 },
{ OrderID: 10507, CustomerID: "ANTON", OrderDate: new Date(2015, 4, 16), Freight: 47.45 }
],
orderDetails: [
{ OrderID: 10643, ProductName: "Chartreuse verte", UnitPrice: 18, Quantity: 21 },
{ OrderID: 10643, ProductName: "Spegesild", UnitPrice: 12, Quantity: 2 },
{ OrderID: 10692, ProductName: "Vegie-spread", UnitPrice: 43.9, Quantity: 20 },
{ OrderID: 10702, ProductName: "Aniseed Syrup", UnitPrice: 10, Quantity: 6 },
{ OrderID: 10308, ProductName: "Gudbrandsdalsost", UnitPrice: 36, Quantity: 1 },
{ OrderID: 10308, ProductName: "Outback Lager", UnitPrice: 15, Quantity: 5 },
{ OrderID: 10625, ProductName: "Tofu", UnitPrice: 23.25, Quantity: 3 },
{ OrderID: 10625, ProductName: "Camembert Pierrot", UnitPrice: 34, Quantity: 10 },
{ OrderID: 10365, ProductName: "Queso Cabrales", UnitPrice: 21, Quantity: 24 },
{ OrderID: 10507, ProductName: "Ipoh Coffee", UnitPrice: 46, Quantity: 15 },
{ OrderID: 10507, ProductName: "Chocolade", UnitPrice: 12.75, Quantity: 15 }
]
};
</script> |